*{
	box-sizing: border-box;
}
.main{
	width: 100%;
	height: calc(100vh - 2px);
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding: 0px 16px 0;
	padding-top: calc(constant(safe-area-inset-top) + 102px); 
	padding-top: calc(env(safe-area-inset-top) + 102px);
	color: #000;
	background: url('../../static/bk_top_jc.jpg') repeat-y 50%;
	background-size: 100%;
	position: fixed;
	top: 0;
	.header_group{
		width: 100%;
		margin: 0 auto;
		position: relative;
		
		.TitGroup{
			display: flex;
			justify-content: flex-start;
			align-items: center;
			padding: 40px 16px 23px 34px;
			
			.iconBox{
				display: block;
				max-width: 120px;
				max-height: 120px;
				
				.icon_img{
					display: block;
					width: 106px;
					height: 0;
					padding-bottom: 94.33%;
					background: url('../../static/icon_card_manage_shh.png') no-repeat 50%;
					background-size: 100%;
				}
			}
			.txt_tit{
				color: #562e0a;
				font-size: 28px;
				line-height: 36px;
				word-break: break-all;
				text-align: left;
				padding-left: 34px;
			}
		}
	}
	.content_group{
		width: 100%;
		min-height: calc(100% - 316px);
		height: 100vh;
		overflow: hidden;
		
		.main_content{
			background: #fcfcfc;
			overflow-y: scroll;
			height: 100%;
			width: 100%;
			padding-bottom: 220px;
			border-radius: 16px;
			
			.icon_group{
				width: 100%;
				
				.data_group{
					width: 100%;
					height: 100%;
					margin-bottom: 300px;
					
					.data_group_box{
						width: 100%;
						display: flex;
						flex-direction: column;
						padding-bottom: 0;
						
						.data_group_box_item{
							width: 100%;
							display: flex;
							justify-content: center;
							align-items: flex-start;
							flex-direction: column;
							height: 148px;
							padding: 16px 36px 10px;
							min-height: 64px;
							line-height: 64px;
							font-size: 24px;
							color: #fff;
							border-bottom: 2px solid;
							border-color: hsla(0,0%,84.7%,.35);
							background: transparent;
							position: relative;
							
							.txt_title{
								color: #562e0a;
								font-size: 36px;
								width: auto;
								display: inline-block;
								white-space: nowrap;
								line-height: 1.5;
								position: relative;
							}
							.txt_content{
								display: flex;
								flex-direction: column;
								
								p{
									color: #9d7201;
									display: flex;
									flex-direction: row;
									font-size: 24px;
									margin-bottom: 0;
									vertical-align: bottom;
									
									span{
										display: inline-block;
										font-size: 24px;
										line-height: 1.5;
									}
									.txt_no{
										padding-right: 30px;
									}
									.txt_account{
										color: #c6aa65;
										position: relative;
										font-size: 24px;
										width: 200px;
										text-overflow: ellipsis;
										overflow: hidden;
										white-space: nowrap;
									}
								}
							}
							.arrow{
								width: 20px;
								height: 34px;
								background: url('') no-repeat 50%;
								display: inline-block;
								background-size: 100%;
								position: absolute;
								top: 60px;
								right: 34px;
							}
						}
					}
					.AddCardGroup{
						display: flex;
						justify-content: center;
						flex-direction: column;
						align-items: center;
						padding-top: 110px;
						
						.addCard_bg{
							width: 110px;
							height: 92px;
							background: url('../../static/icon_addCard_bg.png') no-repeat 50%;
							background-size: 100%;
						}
						.txt_tit{
							font-size: 36px;
							color: #c8c8c8;
							padding-top: 34px;
							
							.hit-text{
								color: red;
								font-weight: 600;
							}
						}
					}
				}
			}
		}
	}
}
.modalcon{
	position: relative;
}
.modalcontitle{
	color: #562e0a;
	border-bottom: 2px solid;
	border-color: hsla(0,0%,84.7%,.35);
	font-size: 36px;
	text-align: center;
	padding-bottom: 30px;
	display: flex;
	width: 100%;
	justify-content: center;
	align-items: center;
	padding-top: 10px;
}
.close{
	border: 5px solid #9d7201;
	position: absolute;
	cursor: pointer;
	top: 14px;
	right: 32px;
	width: 50px;
	height: 50px;
	border-radius: 50%;
}
.close::before{
	background: #9d7201;
	position: absolute;
	content: "";
	height: 4px;
	width: 100%;
	top: 50%;
	left: 0;
	margin-top: -2px;
	border: 4px solid transparent;
	border-radius: 100%;
	transform: rotate(45deg);
}
.close::after{
	background: #9d7201;
	position: absolute;
	content: "";
	height: 4px;
	width: 100%;
	top: 50%;
	left: 0;
	margin-top: -4px;
	border: 4px solid transparent;
	border-radius: 100%;
	transform: rotate(-45deg);
}
.modalconbody{
	height: calc(100% - 100px);
	overflow-y: scroll;
	
	.tabs{
		display: flex;
		width: 100%;
		justify-content: flex-start;
		margin-top: 20px;
		padding: 0 20px;
		
		.tabsitem{
			font-size: 26px;
			border: 2px solid #d4b59a;
			padding: 10px;
			border-radius: 10px;
			color: #563813;
			margin-left: 10px;
		}
		.tabsitem.active{
			background: #d4b59a;
			color: #fff;
		}
	}
	.form_group{
		width: 100%;
		min-height: 400px;
		overflow-y: scroll;
		display: flex;
		justify-content: flex-start;
		align-items: center;
		padding: 40px 34px;
		flex-direction: column;
		
		.rate{
			color: #563813;
			margin-bottom: 44px;
			font-size: 28px;
			text-align: center;
		}
		.payName{
			//height: 72px;
			padding: 4px 10px;
			color: #563813;
			width: 90%;
			font-size: 28px;
		}
	}
}
.BtnSubmit{
	width: 100%;
	display: flex;
	justify-content: center;
	
	.btns{
		width: 400px;
		height: 72px;
		border-radius: 10px;
		background: #fbc847;
		outline: none;
		border: 0;
		font-size: 36px;
		font-weight: 600;
		background-color: #d4b59a;
		color: #fff;
		text-transform: uppercase;
		text-align: center;
		line-height: 72px;
	}
}

:global{
	.ant-modal {
		.ant-modal-content{
			height: calc(100% - 200px) !important;
			min-height: 480px;
			padding: 30px 0;
			border-radius: 6px;
			box-shadow: 0 2px 6px rgba(0,0,0,.2);
			background-color: #f4f4ef;
		}
	}
	.ant-input{
		color: #fff!important;
		border: 2px solid hsla(0,0%,84.7%,.35)!important;
		background: #acaaaa!important;
		width: 90%;
		height: 72px;
		border-radius: 10px;
		padding: 4px 10px;
		font-size: 24px;
		margin-bottom: 44px;
		box-shadow: 0 0 0 0 transparent !important;
	}
}